<template>
	<view>
		<uni-nav-bar left-icon="back" left-text="返回" right-icon="compose" :title="details.company" @clickLeft="navclickL" @clickRight="navclickr"></uni-nav-bar>

		<!-- 第一块 -->
		<view class="jieshao">
			<u-grid :col="3" :border="false">
				<u-grid-item class="" :custom-style="{ color: '#CCCCCC' }">
					<view class="gridflex">
						<view class="">商机标题</view>
						<view style="color:#999" class="grid-text">{{details.title}}</view>
					</view>
				</u-grid-item>
				<u-grid-item :custom-style="{ color: '#CCCCCC' }">
					<view class="gridflex">
						<view class="">负责销售</view>
						<view style="color:#999" class="grid-text">{{details.charge}}</view>
					</view>
				</u-grid-item>
				<u-grid-item :custom-style="{ color: '#CCCCCC' }">
					<view class="gridflex">
						<view class="">报价总金额</view>
						<view style="color:#999" class="grid-text">{{details.money}}</view>
					</view>
				</u-grid-item>
				
			</u-grid>
			<!--  -->
		</view>
		<!--  -->
		<!-- tab切换 -->
		<cusTabs :details="details" :product="product"></cusTabs>

		<!-- 底部按钮 -->
		<view class="bottombotton">
			<u-grid :col="4" 
			style="position: fixed;bottom: 0;left: 0;"
			hover-class="none">
				<u-grid-item>
					<image src="../../static/xiexin.jpg" mode=""></image>
					<view class="grid-text">写动态</view>
				</u-grid-item>

				<u-grid-item @click="editclick">
					<image src="../../static/two.jpg" mode=""></image>

					<view class="grid-text">编辑</view>
				</u-grid-item>
				<u-grid-item>
					<image src="../../static/kehu.jpg"></image>
					<view class="grid-text">转换合同</view>
				</u-grid-item>
				<u-grid-item>
					<image src="../../static/kehu.jpg"></image>
					<view class="grid-text">删除商机</view>
				</u-grid-item>
				
					
			</u-grid>
		</view>
	</view>
</template>
<script>
import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue';
import cusTabs from '../../components/custabs.vue';
import cusPop from '../../components/customers-pop/customers-pop.vue';
/* import cusPop2 from '../../components/customers-sortpop/customers-sortpop.vue'; */

export default {
	data() {
		return {
		
			//展示内容
			product:[['商城系统','小程序商城','30000','20天'],['聊天商城','小程序-聊天','5000','4天']],
			//资料详情
			details:{
				title:'商机标题',
				company:'深圳木卫二科技有限公司',
				charge:'李小红',
				money:10000,
				range:'初步洽谈',
				odds:'100%',
				sources:'电话营销',
				cdate:'2019-03-15',
				remark:'-'
			}
			
		};
	},
	components: {
		uniNavBar,
		cusTabs,
		cusPop,
		
	},
	onLoad() {
		this.productdata = [['商城系统', '商城', 30000, 20], ['聊天系统', '商城-聊天', 5000, 4]];
	
	},
	methods: {
		//编辑按钮点击
		editclick(){
			let that=this;
			uni.navigateTo({
				url:'/pages/index/newClues',
				
				success:function(res){
					
				}
			})
		},
		//左键返回
		navclickL(){
			uni.navigateBack({
			    delta: 1
			});
		}
	
		 
	}
};
</script>

<style lang="scss" scoped>
.gridgray {
	color: #eee;
}
.jieshao {
	font-size: 10px;
	height: 130rpx;
	background-color: #f9f9f9;
	padding-bottom: 20rpx;
	.gridflex {
		text-align: center;
		line-height: 20px;
		height: 66rpx;
	}
}
.popupmain {
	/* margin: 20rpx; */
	width: 750rpx;
	height: 500rpx;
	background-color: #666;
	padding: 40rpx;

	.poptop {
		border-radius: 10rpx;
		color: #1678ff;
		background-color: #ffffff;
		text-align: center;
		line-height: 80rpx;
		.poppt {
			color: #1678ff;
			.clickH {
				background-color: #eee;
				color: #1678ff;
			}

			/* display: block;
			width: 710rpx;
			height: 100rpx; */
		}
		/* .poppt:hover {
			background-color: red;
		} */
	}
	.popbottom {
		border-radius: 10rpx;
		margin-top: 50rpx;
		text-align: center;
		padding: 10rpx 20rpx 20rpx;
		line-height: 40rpx;
		background-color: #ffffff;
		color: #1678ff;
	}
}
.poptop {
	text-align: center;
	.topcha {
		margin-left: 330rpx;
	}
}
.popuppppp,
.bottombotton {
	font-size: 14px;
	font-weight: 400;
	color: #999999;
	image {
		width: 44rpx;
		height: 44rpx;
	}
}
</style>
